//门诊收费处收费员工作量统计
import React from 'react';
import { Table, Row, Col, Button, DatePicker, Select } from 'antd';
import moment from 'moment';
import { $http } from '../../../containers/config/https';
import store from '../../../store';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';

const { Option } = Select;
export default class FindOutpatientCashierWorkload extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            startDate: moment(new Date),
            stopDate: moment(new Date),
            tableData: [],
            user: [],
            userID: null,

            columns: [],
            languageTable1: {}, // 国际化Table1
            languageTable2: {}, // 国际化Table2
            languageData: {}, // 国际化语言包
            language: {},   // 国际化语言
            languageCode: JSON.parse(window.sessionStorage.userData).language, // 国际化语言标识

        }
        // this.columns = [
        //     {
        //         title: '工号',
        //         dataIndex: 'Card',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '姓名',
        //         dataIndex: 'Name',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '收费笔数',
        //         dataIndex: 'NormalInvNum',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '收费金额',
        //         dataIndex: 'NormalInvAmt',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '红冲笔数',
        //         dataIndex: 'StrikeInvNum',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '红冲金额',
        //         dataIndex: 'StrikeInvAmt',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '作废笔数',
        //         dataIndex: 'AbortInvNum',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '作废金额',
        //         dataIndex: 'AbortInvAmt',
        //         width: '100px',
        //         align: 'center',
        //     },
        //     {
        //         title: '挂号笔数',
        //         dataIndex: 'RegisteredNum',
        //         width: '100px',
        //         align: 'center',
        //     },
        // ]
    }
    //初始化数据
    componentDidMount() {
        this.tableList("OutpatientCashierWorkload", "OutpatientCashierWorkload");
        this.getUserData()
        this.handleQuery()
    }

    onColumnRef = (ref) => {
        console.log(ref)
        this.columnRef = ref;
    }
    // 获取主列表columns
    tableList = (reactCode, compontName) => {
        var data = {
            params: [{
                "reactCode": [reactCode],
                "compontName": compontName,
                "type": "C"
            }]
        }
        console.log(1, data)
        $http.post('urlS', this, {
            code: '01040073',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    let resC = res.result.C
                    let { languageCode } = this.state
                    for (var i = 0; i < resC.length; i++) {
                        resC[i].key = i;
                    }
                    if (languageCode === "EN") {
                        resC.map((item, i) => {
                            item.title = item.enDescripts
                        })
                    }

                    if (languageCode === "CN") {
                        resC.map((item, i) => {
                            item.title = item.descripts
                        })
                    }
                    let arr = res.result && resC.length > 0 ? JSON.parse(JSON.stringify(resC)).map(item => {
                        return {
                            align: item.align,
                            widthNum: parseInt(item.width),
                            width: item.width,
                            dataIndex: item.dataIndex,
                            title: <div onDoubleClick={() => this.columnRef.onOpenModel()}>{item.title}</div>,
                            display: item.display,
                            key: item.seqNo
                        }
                    }) : '';
                    let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                    this.setState({
                        columns: filterArr,
                        languageTable1: res.result.B || {},  // 国际化Table1
                        languageTable2: res.result.C || {},  // 国际化Table2
                        languageData: res.result.language || {},  // 国际化语言包
                    }, () => {
                        this.LanCNEN(this.state.languageCode)
                    })
                }
            }
        })
    }

    LanCNEN = (code) => {
        let { languageData } = this.state
        this.setState({
            language: languageData[code]
        })
    }


    //基础数据
    handleQuery = () => {
        let { startDate, stopDate, userID } = this.state;
        let data = {}
        data = {
            params: [{
                "startDate": startDate,
                "stopDate": stopDate,
                "userID": userID || '',
            }],
        }
        $http.post('urlDeanlt', this, {
            code: '05100193',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0 && res.data) {
                    for (var i = 0; i < res.data.length; i++) {
                        res.data[i].key = i;
                    }
                    this.setState({ tableData: res.data, total: res.data.length, loading: false })
                } else {
                    this.setState({ tableData: [], total: 0, loading: false })
                }
            }
        })
    }

    //操作员
    getUserData = () => {
        var data = {
            params: [{
                "hospID": JSON.parse(window.sessionStorage.userData).hospID, //医院id 
                "locTypeCode": "C"
            }]
        }
        $http.post("urlS", this, {
            code: '05210023',
            data: data,
            success: function (res) {
                if (+res.errorCode === 0 && res.user) {
                    for (var i = 0; i < res.user.length; i++) {
                        this.state.user.push(<Option value={String(res.user[i].id)} key={i + "U"}>{res.user[i].descripts}</Option>)
                    }
                    this.setState({ user: this.state.user })
                }
            },
            error: function (err) {
                this.setState({ errMsg: "数据加载失败，请重试！" })
            }
        })
    }

    // 查询条件 --- 开始日期
    onChangeStartDate = (e) => {
        this.setState({ startDate: e });
    }
    // 查询条件 --- 结束日期
    onChangeStopDate = (e) => {
        this.setState({ stopDate: e });
    }
    // 查询条件 --- 操作员
    onChangeUserID = (e) => {
        this.setState({ userID: e });
    }
    render() {
        let {language}=this.state
        return (
            <div>
                <div style={{ width: '100%', height: '100%' }}>
                    <div>
                        <Row style={{ minHeight: '80px', padding: '0 24px' }}>
                            <Col span={24} style={{ marginTop: '24px' }}>
                                <Col span={4}>{language.OutpatientCashierWorkloadstartDate && language.OutpatientCashierWorkloadstartDate.descripts}：<DatePicker allowClear={false} format="YYYY-MM-DD" style={{ marginRight: '10px' }} value={this.state.startDate} onChange={this.onChangeStartDate} /></Col>
                                <Col span={4}>{language.OutpatientCashierWorkloadstopDate && language.OutpatientCashierWorkloadstopDate.descripts}：<DatePicker allowClear={false} format="YYYY-MM-DD" style={{ marginRight: '10px' }} value={this.state.stopDate} onChange={this.onChangeStopDate} /></Col>
                                <Col span={4}>{language.OutpatientCashierWorkloaduserID && language.OutpatientCashierWorkloaduserID.descripts}：<Select allowClear placeholder="Inserted are removed" style={{ width: '150px' }} value={this.state.userID} onChange={this.onChangeUserID}>{this.state.user}</Select></Col>
                                <Col span={4}><Button type="primary" onClick={this.handleQuery}>{language.OutpatientCashierWorkloadhandleQuery && language.OutpatientCashierWorkloadhandleQuery.descripts}</Button></Col>
                            </Col>
                        </Row>
                    </div>
                    <div style={{ widht: '100%', height: '10px', background: '#f0f2f5' }}></div>
                    <div style={{ padding: 24 }}>
                        {/* <Table
                            columns={this.columns}
                            dataSource={this.state.tableData}
                        ></Table> */}
                        <Table
                            dataSource={this.state.tableData}
                            columns={this.state.columns}
                            pagination={false}
                            bordered
                        />
                        <ColumnAuthoritysModel
                            clientWidth='900px'
                            compontName='OutpatientCashierWorkload'
                            configType="C"
                            onRef={this.onColumnRef}
                            reloadData={this.tableList}
                        />

                    </div>
                </div>
            </div>
        )
    }
}